<style lang="less">
    .card_style {
        height: 100%;
        width: 100%;
        overflow: hidden;
        .ivu-card-body {
            padding: 0px;
        }
    }

    .page_style {
        margin-top: 10px;
        text-align: right;
    }

    .bench_search {
        margin-bottom: 10px;
    }

    .nopadding .ivu-table-cell {
        padding: 0px 0px;
    }

    .item1 {
        height: 42px;
        line-height: 40px;
    }
</style>
<template>
    <div>
        <Form :label-width="120" inline>
            <Form-item label="接口名称:">
                <Input v-model="queryParam.interfaceName"/>
            </Form-item>
            <Form-item label="接口调用开关:">
                <Select v-model="queryParam.onOff" placeholder="接口开关" clearable v-bind:disabled="disable"
                        style="width: 120px">
                    <Option value="1">开启</Option>
                    <Option value="0">关闭</Option>
                </Select>
            </Form-item>
            <Row class="button_row">
                <span style="float: left;">
                  <Button type="primary" @click="createModel"><Icon type="ios-add"/>新增</Button>
                </span>
                <span style="float: right;">
                <Button type="primary" @click="searchQuery" style="margin-left: 10px"><Icon
                        type="ios-search"/> 查询</Button>
                    <Button type="primary" class="button_item_left" @click="searchReset"><Icon
                            type="ios-refresh"></Icon>重置</Button>
                </span>
            </Row>
        </Form>
        <Modal v-model="modalShow" :title="title" :mask-closable="false" width="700">
            <Spin size="large" fix v-if="Loading"></Spin>
            <Form :model="formItem" :label-width="120" ref="ruleValidate" :rules="ruleValidate">
                <FormItem label="接口名称:" prop="interfaceName">
                    <Input v-model="formItem.interfaceName" style="width: 400px;" v-bind:disabled="disable"
                           placeholder="接口名称"></Input>
                </FormItem>

                <FormItem label="接口地址:" prop="interfaceUrl">
                    <Input :min="0" v-model="formItem.interfaceUrl" style="width: 400px;" v-bind:disabled="disable"
                           placeholder=""></Input>
                </FormItem>
                <FormItem label="接口类型:" prop="interfaceType">
                    <Select v-model="formItem.interfaceType" placeholder="接口类型" v-bind:disabled="disable"
                            style="width: 400px">
                        <Option value="100">沈阳市户籍验证</Option>
                        <Option value="400">民政殡葬火化死亡人口验证</Option>
                        <Option value="500">卫健委居民死亡人口验证</Option>
                        <Option value="200">城乡低保（低保边缘）重复保验证</Option>
                        <Option value="300">特困供养重复保验证</Option>
                        <Option value="600">社会组织法人验证</Option>
                        <Option value="700">个体工商经营者验证</Option>
                        <Option value="800">低保经办人及近亲属验证</Option>
                        <Option value="900">残疾人信息验证</Option>
                        <Option value="1000">企业机构法人验证</Option>
                        <Option value="1100">扶贫人口信息验证</Option>
                        <Option value="1200">服刑人员信息验证</Option>
                        <Option value="1400">查询殡葬监管数据验证</Option>
                        <Option value="1500">办理过程推送</Option>
                        <Option value="1600">行权流程获取授权</Option>
                        <Option value="1700">行权流程启动</Option>
                        <Option value="1800">行权流程审批</Option>
                        <Option value="1900">行权流程获取任务</Option>
                        <Option value="2000">低保增量数据推送</Option>
                        <Option value="3000">高龄验证</Option>
                        <Option value="3100">法人验证(企业机构、个体工商、社会组织)</Option>
                        <Option value="3200">调标验证</Option>
                        <Option value="3300">离退休人员信息验证</Option>
                        <Option value="3400">供养遗属信息验证</Option>
                        <Option value="3500">知青救助验证</Option>
                    </Select>
                </FormItem>
                <FormItem label="接口appkey:" prop="appKey" v-if="type==1">
                    <Input v-model="formItem.appKey" style="width: 400px;" v-bind:disabled="disable"
                           placeholder=""></Input>
                </FormItem>
                <FormItem label="接口开关:" prop="onOff">
                    <Select v-model="formItem.onOff" placeholder="接口开关" v-bind:disabled="disable" style="width: 400px">
                        <Option value="1">开启</Option>
                        <Option value="0">关闭</Option>
                    </Select>
                </FormItem>
            </Form>
            <div slot="footer">
                <Button type="info" v-if="type==='1' && type !== '3'" @click="addOk('ruleValidate')">添加</Button>
                <Button type="info" v-if="type==='2' && type !== '3'" @click="updateOk('ruleValidate')">保存</Button>
                <Button type="default" @click="closeModel">关闭</Button>
            </div>
        </Modal>

        <div class="table_div">
            <Table :columns="columns1" :data="tableData">
                <template slot-scope="{ row }" slot="action">
                    <Button type="info" size="small" style="margin-right: 5px" @click="updateModal(row)">编辑</Button>
                    <Button type="success" size="small" style="margin-right: 5px" @click="showModal(row)">详情</Button>
                    <Button type="error" size="small" style="margin-right: 5px" @click="remove(row)">删除</Button>
                </template>
            </Table>
            <Page :total="dataCount" :page-size="pageSize" @on-change="handleTableChange" :current="pageNo" show-total
                  class="paging"></Page>
        </div>
    </div>
</template>

<script>
    import {postAction} from '@/api/request'
    import {CommonMixin} from '@/views/common/js/CommonMixin'

    export default {
        mixins: [CommonMixin],
        data() {
            return {
                Loading:false,
                //批次号
                batchNumber: '',
                validateInfo: '',
                validateStatus: true,
                showAppKey: true,
                //事前查验标题
                yzModalTitle: '',
                azcp0001: '',
                azcp0003: '',
                ss12001Id: '999999999999',
                level: '1',
                isSend: false,
                ruleValidate: {
                    // interfaceName: [
                    //     { required: true,  type: 'string', message: '请选择区划', trigger: 'change' }
                    // ],
                    // interfaceUrl: [
                    //     {
                    //         required: true,
                    //         message: '请输入人口统计年度'
                    //     },
                    //     {
                    //         type:'number',
                    //         message:'输入的类型为数字',
                    //         transform(value) {
                    //             return Number(value);
                    //         }
                    //     }
                    // ],
                    // interfaceType: [
                    //     {
                    //         required: true,
                    //         message: '请输入城市人口数量'
                    //     },
                    //     {
                    //         type:'number',
                    //         message:'输入的类型为数字',
                    //         transform(value) {
                    //             return Number(value);
                    //         }
                    //     }
                    // ],
                    // appKey: [
                    //     {
                    //         required: true,
                    //         message: '请输入农村人口数量'
                    //     },
                    //     {
                    //         type:'number',
                    //         message:'输入的类型为数字',
                    //         transform(value) {
                    //             return Number(value);
                    //         }
                    //     }
                    // ],
                },
                type: '',
                title: '',
                mode: true,
                statusLevel: '',
                disable: false,
                formItem: {
                    id: '',
                    interfaceName: '',
                    interfaceUrl: '',
                    interfaceType: '',
                    appKey: '',
                    onOff: '',
                },
                modalShow: false,
                // 初始化信息总条数
                dataCount: 0,
                // 每页显示多少条
                pageSize: 10,
                queryParam: {},
                url: {
                    list: "/api/ac/subsistence/ss00111Service/getPageList",
                },
                columns1: [
                    {
                        title: '接口名称',
                        key: 'INTERFACE_NAME',
                        align: 'center',
                        width: '300'
                    },
                    {
                        title: '接口编码',
                        key: 'INTERFACE_TYPE',
                        align: 'center',
                        width: '100'
                    },
                    {
                        title: '接口地址',
                        align: 'center',
                        width: '400',
                        key: 'INTERFACE_URL'
                    },
                    {
                        title: '接口调用开关',
                        align: 'center',
                        key: 'ON_OFF',
                        render: (h, params) => {
                            let value = params.row.ON_OFF
                            if (typeof (value) === 'undefined' || value === null || value === '' || value === undefined) {
                                value = ''
                            } else if (value === '1') {
                                value = "开启"
                            } else if (value === '0') {
                                value = "关闭"
                            }
                            return h('span', value + ' ')
                        }
                    }
                    , {
                        title: '操作',
                        key: 'action',
                        align: 'center',
                        slot: 'action',
                        width: '200',
                        className: 'nopadding',
                    }
                ],
                data: []
            }
        },
        methods: {
            // 删除
            remove(item) {
                if (confirm('确定删除该条数据吗')) {
                    var dataParam = {
                        id: item.ID
                    }
                    postAction('/api/ac/subsistence/ss00111Service/delete', dataParam).then((res) => {
                        this.loadData()
                        this.$Notice.success({title: '删除成功', desc: ''})
                        this.modalShow = false
                    }).finally(() => {

                    })
                }
            },
            closeModel() {
                this.modalShow = false
            },
            //新增事件
            addOk(name) {
                this.$refs[name].validate((valid) => {
                    if (valid) {
                        let dataParam = {
                            interfaceName: this.formItem.interfaceName,
                            interfaceUrl: this.formItem.interfaceUrl,
                            interfaceType: this.formItem.interfaceType,
                            appKey: this.formItem.appKey,
                            onOff: this.formItem.onOff,
                        }
                        this.Loading = true;
                        postAction('/api/ac/subsistence/ss00111Service/insert', dataParam).then((res) => {
                            if (res.data.data.errcode === 0) {
                                this.modalShow = false
                                this.$Message.success("新增成功！")
                                this.loadData(1)
                            } else {
                                this.$Message.error(res.data.data.msg);
                            }
                        }).finally(() => {
                            this.Loading = false;
                        })
                    } else {
                        this.$Notice.error({title: '请输入不为空的项!', desc: '请输入不为空的项!'})
                    }
                });

            },
            updateOk(name) {
                this.formItem.interfaceName = this.formItem.bindXq;
                this.$refs[name].validate((valid) => {
                    if (valid) {
                        let dataParam = {
                            id: this.formItem.id,
                            interfaceName: this.formItem.interfaceName,
                            interfaceUrl: this.formItem.interfaceUrl,
                            interfaceType: this.formItem.interfaceType,
                            appKey: this.formItem.appKey,
                            onOff: this.formItem.onOff,
                        }
                        this.Loading = true;
                        postAction('/api/ac/subsistence/ss00111Service/update', dataParam).then((res) => {
                            if (res.data.data.errcode === 0) {
                                this.modalShow = false
                                this.$Message.success("编辑成功！")
                                this.loadData(1)
                            } else {
                                this.$Message.error(res.data.data.msg);
                            }
                        }).finally(() => {
                            this.Loading = false;
                        })
                    } else {
                        this.$Notice.error({title: '请输入不为空的项!', desc: '请输入不为空的项!'})
                    }
                });

            },
            //新增
            createModel() {
                var date = new Date();
                this.modalShow = true
                this.formItem.id = ''
                this.formItem.interfaceName = '',
                    this.formItem.interfaceUrl = '';
                this.formItem.interfaceType = ''
                this.formItem.appKey = ''
                this.formItem.onOff = ''
                this.type = '1'
                this.title = '新增'
                this.disable = false
            },
            showModal(row) {
                this.title = '详情'
                this.modalShow = true
                this.showAppKey = false
                this.type = '3'
                this.formItem.id = row.ID
                this.formItem.interfaceName = row.INTERFACE_NAME
                this.formItem.interfaceUrl = row.INTERFACE_URL
                this.formItem.interfaceType = row.INTERFACE_TYPE
                this.formItem.appKey = row.APP_KEY
                this.formItem.onOff = row.ON_OFF
                this.disable = true
            },
            updateModal(row) {
                //下拉框选中
                this.modalShow = true
                this.showAppKey = false
                this.type = '2'
                this.title = '修改'
                this.formItem.id = row.ID
                this.formItem.interfaceName = row.INTERFACE_NAME
                this.formItem.interfaceUrl = row.INTERFACE_URL
                this.formItem.interfaceType = row.INTERFACE_TYPE
                this.formItem.onOff = row.ON_OFF
                this.disable = false
            },

        },
        created() {
            // 默认请求第一页列表
            this.loadData();
        }

    }
</script>

<style scoped>
    .paging {
        float: right;
        margin-top: 10px;
    }
</style>
